.loading{
    position: fixed;
    z-index: 10000000;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}
.loading .loading-mark{
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.6);
}
.loading .loading-spot {
    width: 1.4rem;
    height: 1.4rem;
    border-radius: 100%;
    background: rgba(0, 0, 0, 0.9);
    position: absolute;
    top: 0px;
    left: 0px;
}

@-webkit-keyframes loadingAnimate {
    50%{
        transform: scale(0.4);
        opacity: 0.6;
    }
    100%{
        transform: scale(1);
        opacity: 1;
    }
}

/* 不是从1开始，因为第一个元素是.loading-mark !! */
.loading .loading-spot:nth-child(2){
    -webkit-animation: loadingAnimate 1s ease -0.12s infinite;
}
.loading .loading-spot:nth-child(3){
    -webkit-animation: loadingAnimate 1s ease -0.24s infinite;
}
.loading .loading-spot:nth-child(4){
    -webkit-animation: loadingAnimate 1s ease -0.36s infinite;
}
.loading .loading-spot:nth-child(5){
    -webkit-animation: loadingAnimate 1s ease -0.48s infinite;
}
.loading .loading-spot:nth-child(6){
    -webkit-animation: loadingAnimate 1s ease -0.60s infinite;
}
.loading .loading-spot:nth-child(7){
    -webkit-animation: loadingAnimate 1s ease -0.72s infinite;
}
.loading .loading-spot:nth-child(8){
    -webkit-animation: loadingAnimate 1s ease -0.84s infinite;
}
.loading .loading-spot:nth-child(9){
    -webkit-animation: loadingAnimate 1s ease 0s infinite;
}
